<template>
	<view>
		<view v-if="inPorcessOrderId != null" class="order-process" @click="toOrder">您有进行中的订单,点击查看</view>
		
		<map id="map" :longitude="from.longitude" :latitude="from.latitude" :style="contentStyle" scale="15" :enable-traffic="false" :show-location="true" :enable-poi="true" class="map">
			<cover-image class="location" src="../../static/workbench/location.png" @tap="toLocationHandle()"></cover-image>
		</map>
		<view class="panel">
			<view class="from" @tap="chooseLocationHandle('from')">
				<text>{{ from.address }}</text>
			</view>
			<view class="dashed-line"></view>
			<view class="to" @tap="chooseLocationHandle('to')">
				<text>{{ to.address }}</text>
			</view>
			<button class="btn" @tap="toCreateOrderHandle">查看路线</button>
		</view>
	</view>
</template>

<script>
	
import GtPush from '../../lib/gtpush-min.js'
//地图点选插件
const chooseLocation = requirePlugin('chooseLocation');
let QQMapWX = require('../../lib/qqmap-wx-jssdk.min.js');
let qqmapsdk ;

export default {
	data() {
		return {
			//开始位置
			from: {
				address: '输入你的开始位置',
				longitude: 0,
				latitude: 0
			},
			//结束位置
			to: {
				address: '输入你的目的地', 
				longitude: 0,
				latitude: 0
			},
			
			//窗口样式
			contentStyle: '',
			windowHeight: 0,
			//地图对象
			map: null,
			//标记:开始位置点选或者结束位置点选
			chooseFromOrToflag: null,
			inPorcessOrderId:null,
			chooseType:"",
			appid:"4lCObZLdaDASAW2RfZbsA3"
		};
	},
	methods: {
		//个推的方法
		initGTPush(){
				let _this = this
				GtPush.setDebugMode(true)
						
				GtPush.init({
					appid: _this.appid,
					//发送绑定请求出，让cid和customerId进行绑定，回调得到绑定id
					onClientId: (res) => {
						console.log('onClientId = ' + res.cid)
						_this.post("order/app/order/alias/bind/"+ res.cid,(res)=>{
							const {success}=res.data
							if(!success){
								uni.showToast({
									icon:'error',
									title:"获取绑定别名失败，请联系管理员"
								})
							}
						})
				
					},
					//
					onlineState: (res) => {
						console.log('onlineState = ' + res.online)
					},
					//个推消息回调方法，这里得到司机个推给用户的orderNo
					onPushMsg: (res) => {
						console.log('onPushMsg = ' + res.message)
						
					},
					onError: (res) => {
					}
				})
		},
		//查看正在进行的订单
		toOrder(){
			const _this=this;
			const order =uni.getStorageSync("order")
			//等待接单状态
			console.log(order);
			if(order.status==_this.Consts.OrderStatus.ORDER_STATUS_WAIT){
				uni.navigateTo({
					url:'/pages/create_order/create_order'
				})
 			}
			//已接单状态 
			else if(order.status==_this.Consts.OrderStatus.ORDER_STATUS_ACCEPTED
				 ||order.status==_this.Consts.OrderStatus.ORDER_STATUS_ARRIVE
				 ||order.status==_this.Consts.OrderStatus.ORDER_STATUS_START_DRIVING)
			{
				//跳转到司乘同显页面
				uni.navigateTo({
					url:'/pages/move/move?orderNo='+order.orderNo
				})
			}
			//未付款状态
			else if(order.status==_this.Consts.OrderStatus.ORDER_STATUS_COMPLETE_DRIVED
				 ||order.status==_this.Consts.OrderStatus.ORDER_STATUS_ENSURE
				 ||order.status==_this.Consts.OrderStatus.ORDER_STATUS_NOT_PAY)
			{
				//跳转到订单信息页
				uni.navigateTo({
					url:'/pages/order/order?orderNo='+order.orderNo
				})
			}
		},
		//查询是否有正在进行中的订单
		queryProcessingOrder(){
			const _this = this;
			_this.get("order/app/order/queryProcessingOrder",(res)=>{
				const {data,success}=res.data
				console.log(data);
				if(success && data){
					_this.inPorcessOrderId=data.orderNo
					uni.setStorageSync("order",data)
				}else{
					_this.inPorcessOrderId=null;
				}
			})
		},
		//查看路线
		toCreateOrderHandle(){
			const _this= this;
			const fromtoParam={
				"from": _this.from,
				"to": _this.to}
			uni.setStorageSync("fromtoParam",fromtoParam);
			uni.navigateTo({
				url:'/pages/create_order/create_order'
			})
		},
		//地图选点功能
		chooseLocationHandle(type){ 
			const _this=this;
			_this.chooseType =type;
			let key = 'OCMBZ-IC5CQ-HTE5L-B2AVM-UN4CK-GLFI6';
			let referer = '风云代驾2024测试版'; //调用插件的app的名称
			wx.navigateTo({
				url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer
				
			});
			
		},
		//回到当前位置功能
		toLocationHandle(){
			const _this =this;
			_this.map.moveToLocation()
		},
		//初始化地图
		initMap(){
			const _this =this;
			//初始化地图核心， _this.map的map要与标签map组件 中id标签一致
			 _this.map = uni.createMapContext("map", this);
			uni.getLocation({
					type: "gcj02 ",
					geocode: true,
					success: function(res){
						const {latitude,longitude} = res
						_this.from.latitude=latitude
						_this.from.longitude=longitude
					    _this.getCity({latitude:res.latitude,longitude:res.longitude});
					},
					
				})
		},
		//处理地图显示bug
		initStyle(){
			let _this =this;
			//处理窗口样式
			let windowHeight =uni.getSystemInfoSync().windowHeight;
			_this.windowHeight=windowHeight-200;
			_this.contentStyle=`height:${_this.windowHeight}px`;
		},
		initMapKey(){
			//获取mapkey
			 qqmapsdk =new QQMapWX({
				key: 'OCMBZ-IC5CQ-HTE5L-B2AVM-UN4CK-GLFI6'
			});
		},
		//逆地址解析
		getCity(location){
			const _this= this;
			qqmapsdk.reverseGeocoder({
				location: _this.location,
				success: (res)=>{
					if(res.status==0){
						_this.from.address =res.result.formatted_addresses.recommend
					}else{
						uni.showToast({
							icon: error,
							title:"获取城市失败！"
						})
					}
				}
			})
		},
		//获取用户地图手动选点地址，从另一个页面拿到的
		getChooseLocation(){
			const _this=this;
			const location =chooseLocation.getLocation();
			if(location){
				if(_this.chooseType=='from'){
					_this.from.address=location.name
					_this.from.longitude=location.longitude
					_this.from.latitude=location.latitude
				}else if(_this.chooseType =='to'){
					_this.to.address=location.name
					_this.to.longitude=location.longitude
					_this.to.latitude=location.latitude
				}
			}
		}
		
	},
	onShow: function() {
		let _this = this;
		_this.initStyle();
		_this.initMapKey();
		_this.getChooseLocation()
		_this.queryProcessingOrder();
	},
	onHide: function() {
	},
	onLoad: function() {
		let _this = this;
		_this.initMap();
		_this.initGTPush();
		
	},
	onUnload: function() {
		
	}
};
</script>

<style lang="less">
@import url('workbench.less');
</style>
